<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Welcome to MSHD!</title>
    <link rel="stylesheet" type="text/css" href="/static/css/style1.css">
    <script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
    <link rel="stylesheet" href="static/css/style1.css" type="text/css" media="all" />
	<!-- Style-CSS -->
	<link href="static/css/font-awesome.min.css" rel="stylesheet">

</head>
<body>
    <div class="main-bg" id="mian">
        <h1>Welcome to MSHD!</h1>
        <div class="sub-main-w3" style="width: 40%">
                <div id="section1" >
                        <article>
                            <form action="/register/" method="post">


                               {% csrf_token %}
                                <h3 class="legend">注册账号</h3>
                                {% if message %}

                                        <h8 class="legend">{{ message }}</h8>
                               {% endif %}
                            <div class="form-group input">
                                <h8 style="    color: #000;
                                    font-size: 14px;
                                    letter-spacing: 1px;
                                    box-sizing: border-box;
                                    border: none;
                                    outline: none;
                                    background: transparent;
                                    width: 90%;">{{ register_form.username.label_tag }}</h8>

                                  {{ register_form.username}}
                              </div>
                              <div class="form-group  input">
                                   <div style="    color: #000;
                                    font-size: 14px;
                                    letter-spacing: 1px;
                                    box-sizing: border-box;
                                    border: none;
                                    outline: none;
                                    background: transparent;
                                    width: 90%;"> {{ register_form.password1.label_tag }}</div>

                                  {{ register_form.password1 }}
                              </div>

                              <div class="form-group  input">
                                  <div style="    color: #000;
                                    font-size: 14px;
                                    letter-spacing: 1px;
                                    box-sizing: border-box;
                                    border: none;
                                    outline: none;
                                    background: transparent;
                                    width: 90%;"> {{ register_form.password2.label_tag }}</div>
                                  {{ register_form.password2 }}
                              </div>
                           <div class="form-group input">
                               <div style="    color: #000;
                                    font-size: 14px;
                                    letter-spacing: 1px;
                                    box-sizing: border-box;
                                    border: none;
                                    outline: none;
                                    background: transparent;
                                    width: 90%;"> {{ register_form.role.label_tag }}</div>
                                  {{ register_form.role }}
                              </div>


                                <button type="submit" class="btn submit">提交</button>
                            <a href="/login/" style="margin: 2.3em auto 0;
                                                            background: #00ad45;
                                                            border: none;
                                                            cursor: pointer;
                                                            font-weight: 600;
                                                        transition: 0.5s all;
                                                            display: block;
                                                            color: #fff;
                                                            padding: 14px 30px;
                                                            text-align: center;
                                                                                ">退出</a>

                            </form>
                        </article>
                    </div>
        </div>

    </div>



</body>
</html>